<template>
    <el-form label-position="top">
        <el-form-item label="临时表保存时长（天）">
            <el-input
                clearable
                placeholder="请输入天数"
                oninput="value=value.replace(/^(0+)|[^\d]+/g,'')"
                v-model="form.cacheExpireDays">
            </el-input>
            <el-button class="btn" type="primary" @click="handleDaySave">保存</el-button>
        </el-form-item>
        <el-form-item label="清理以下日期之前的临时表">
            <el-date-picker v-model="form.clearDate" type="datetime" placeholder="选择日期时间"></el-date-picker>
            <el-button class="btn" type="primary" @click="handleClear">清理</el-button>
        </el-form-item>
        <el-form-item label="">
            <div class="stop-box">
                <span>数据表概要统计</span>
                <el-switch class="btn" v-model="form.enableDataSummary" @change="handleChangeStop"></el-switch>
            </div>
        </el-form-item>
    </el-form>
</template>
<script>
import moment from 'moment'
export default {
    name: 'TableSet',
    data () {
        const projectId = this.$route.params.id
        return {
            projectId,
            form: {
                cacheExpireDays: null,
                clearDate: null,
                enableDataSummary: false
            }
        }
    },
    created () {
        this.init()
    },
    methods: {
        init () {
            this.$post('/project/queryById', { projectId: this.projectId }).then(res => {
                if (res) {
                    this.form = {
                        cacheExpireDays: res.cacheExpireDays,
                        clearDate: null,
                        enableDataSummary: res.enableDataSummary === 1
                    }
                }
            })
        },
        handleDaySave () {
            const { cacheExpireDays } = this.form
            if (cacheExpireDays) {
                const params = {
                    projectId: this.projectId,
                    cacheExpireDays
                }
                this.$post('/project/updateCacheExpireDays', params).then(res => {
                    if (res) {
                        this.$message.success('保存成功')
                    }
                })
            } else {
                this.$message.error('请输入天数')
            }
        },
        handleClear () {
            const { clearDate } = this.form
            if (clearDate) {
                const params = {
                    projectId: this.projectId,
                    clearDate: clearDate && moment(clearDate).format('YYYY-MM-DD HH:mm:ss')
                }
                this.$post('/project/clearTemporaryTable', params).then(res => {
                    if (res || res === 0) {
                        this.$message.success('清理成功')
                    }
                })
            } else {
                this.$message.error('请选择时间')
            }
        },
        handleChangeStop (val) {
            const params = {
                projectId: this.projectId,
                enableDataSummary: val ? 1 : 0
            }
            this.$post('/project/updateEnableDataSummary', params).then(res => {
                if (res) {
                    this.$message.success(val ? '开启成功' : '关闭成功')
                }
            })
        }
    }
}
</script>
<style scoped>
    .btn {
        margin-left: 20px;
    }
    .stop-box {
        display: flex;
        align-items: center;
    }
</style>
